<template>
  <a-modal
    :visible="visible"
    :title="editId ? '更新公告' : '添加公告'"
    okText="保存"
    :width="850"
    @cancel="() => { $emit('cancel') }"
    @ok="() => { $emit('create') }"
  >
    <a-form :form="form">
      <a-form-item
        label="标题"
        :labelCol="{span: 2}"
        :wrapperCol="{span: 21, offset: 1}"
      >
        <a-input v-decorator="['ggbt',
          {
            rules: [{ required: true, message: '请填写标题!' }],
          }]"/>
      </a-form-item>
      <a-form-item
        label="用户端"
        :labelCol="{span: 2}"
        :wrapperCol="{span: 21, offset: 1}"
      >
        <a-select v-decorator="[
          'gglxm',
          {
            rules: [{ required: true, message: '请选择用户端!' }],
          }
        ]">
          <a-select-option v-for="i in TYPE0508" :key="i.id" :value="i.code">{{ i.name }}</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="公告内容" :labelCol="{span: 2}" :wrapperCol="{span: 21, offset: 1}">
        <wang-editor ref="wang" v-model="ggnr" v-decorator="['ggnr',
          {
            rules: [{ required: true, message: '请输入公告内容!' }],
          }
        ]" :isClear="isClear"/>
        <!-- <a-input type="textarea" v-decorator="['ggnr',
          {
            rules: [{ required: true, message: '请输入公告内容!' }],
          }
        ]" :autosize="{ minRows: 2, maxRows: 6 }"/> -->
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script>
import wangEditor from './wangEditor'

export default {
  props: ['visible', 'editId', 'TYPE0508'],
  components: { wangEditor },
  data () {
    return {
      isClear: true,
      ggnr: ''
    }
  },
  watch: {
    ggnr (val) {
      this.$refs.wang.editor.txt.html(val)
    }
  },
  beforeCreate () {
    this.form = this.$form.createForm(this)
  },
  methods: {

  }
}
</script>

<style>
</style>
